<template>
  <div class="home-container">
    <h1>我的任务列表</h1>
    <div class="task-list">
      <TaskItem v-for="task in tasks" :key="task.id" :task="task" />
    </div>
  </div>
</template>

<script setup lang="ts">
import { useTaskStore } from '@/store/taskStore'
import TaskItem from '@/components/TaskItem.vue'
import { storeToRefs } from 'pinia'

const taskStore = useTaskStore()
const { tasks } = storeToRefs(taskStore)
</script>

<style scoped>
.home-container {
  max-width: 800px;
  margin: 0 auto;
  padding: 20px;
}

.task-list {
  margin-top: 20px;
}
</style>